<template>
   <div class="myInfo">
        <van-nav-bar
            title="消息"
            right-text="清空"
            left-arrow
            :fixed="fixd"
            @click-left="onClickLeft"
            @click-right="onClickRight"
            />
        <div class="content">
            <ul>
                <li @click="goTaskMsg" v-if='taskMaeeageInfo.rows'>
                    <div class="left">
                        <div class="image">
                            <img src="../assets/Mymi/MyInformationOne.png" alt="">
                        </div>
                        <div class="dot" v-if="taskMaeeageInfo.msg!=0">
                            <span>{{taskMaeeageInfo.msg}}</span>
                        </div>
                    </div>
                    <div class="right">
                        <div class="tit">
                            <span>任务消息</span>
                            <span>{{taskMaeeageInfo.rows[0].informationCreateTime}}</span>
                        </div>
                        <div class="neirong">
                           {{taskMaeeageInfo.rows[0].informationContent}}
                        </div>
                    </div>
                </li>
              
                 <li  @click="goPlatformDetail"  v-if='platformList.rows'>
                    <div class="left">
                        <div class="image">
                            <img src="../assets/Mymi/MyInformationOne.png" alt="">
                        </div>
                        <div class="dot" v-if="platformList.msg!=0">
                            <span>{{platformList.msg}}</span>
                        </div>
                    </div>
                    <div class="right">
                        <div class="tit">
                            <span>平台消息</span>
                            <span>{{platformList.rows[0].informationCreateTime}}</span>
                        </div>
                        <div class="neirong">
                            {{platformList.rows[0].informationContent}}
                        </div>
                    </div>
                </li>
                <!-- 提现消息 -->
                   <li v-if="withdrawList.rows" @click="goCarryMsg">
                    <div class="left">
                        <div class="image">
                            <img src="../assets/Mymi/MyInformationOne.png" alt="">
                        </div>
                        <div class="dot" v-if="withdrawList.msg!=0">
                            <span>{{withdrawList.msg}}</span>
                        </div>
                    </div>
                    <div class="right">
                        <div class="tit">
                            <span>提现到账提醒</span>
                            <span>{{withdrawList.rows[0].informationCreateTime}}</span>
                        </div>
                        <div class="neirong">
                            {{withdrawList.rows[0].informationContent}}
                        </div>
                    </div>
                </li>
            </ul>    
        </div>    
       
    </div>
</template>

<script>
import { Toast } from 'vant';
export default {
    name:'myInfo',
    data (){
        return {
            platformList:{},//平台消息
            platformNum:'',//平台消息条数
            withdrawList:{},//提现消息
            withdrawNum:"",//提现条数
            taskMaeeageInfo:{},//任务消息列表
            taskNum:"",//任务消息条说

        }
    },
    props:{
        fixd:{
            type:Boolean,
            value:true
        }
    },
    created (){
        this.myTaskInfo();//任务消息
        this.myPlatformMsg();//[平台消息]
        this.myCarryMsg(); //提现消息
    },
    methods:{
           onClickLeft() {
            this.$router.go(-1);
            },
            onClickRight() {
               this.$axios.post("/cct/information/deleteByUser",{}).then(res =>{
                   Toast(res.data.msg)
               })
            },
            
        //任务消息
        myTaskInfo (){
            this.$axios.post("/cct/information/taskMessage",{}).then(res =>{
                // console.log("任务消息",res)
                if(res.data.code==0){
                    if(res.data.rows.length!=0){
                        this.taskMaeeageInfo = res.data;
                        // this.taskNum  =res.data.rows.length;
                    }
                }
            })
        },
        //平台消息
        myPlatformMsg (){
                this.$axios.post("/cct/information/platformMessage",{}).then(res =>{
                    console.log("平台消息",res)
                    if(res.data.code==0){
                        if(res.data.rows.length!=0){
                            this.platformList = res.data;
                        } 
                        
                     }
                })
        },
        //提现消息
            myCarryMsg (){
                this.$axios.post('/cct/information/withdrawMessage',{}).then(res =>{
                    
                    if(res.data.code==0){
                        if(res.data.rows.length!=0){
                            this.withdrawList = res.data;
                            console.log("提现消息",this.withdrawList)
                        }
                     }
                })
            },
       
        //平台消息
        goPlatformDetail (){
            this.$router.push({
                path:"/myInfoList",
                query:{
                    num:1
                }
            })
        },
        //任务消息
        goTaskMsg (){
            this.$router.push({
                path:"/myInfoList",
                query:{
                    num:2
                }
            })
        },
        //提现消息
        goCarryMsg () {
            this.$router.push({
                path:"/myInfoList",
                query:{
                    num:3
                }
            })
        }
    }
}
</script>

<style lang="less" soped>
    .myInfo{
        width: 100%;
        font-size: 0;
        position: relative;
      .content{
          position: absolute;
          top:1.1rem;
          left: 0;
          right: 0;
          width: 100%;
          ul{
              li{
                  display: flex;
                  justify-content: flex-start;
                  height: 1.3rem;
                  padding:  0.2rem;
                  box-sizing: border-box;  
                  align-items: center;
                  margin-bottom: 0.2rem;
                  background-color: #fff;

                  .left{
                      width: 1.2rem;
                      display: flex;
                      position: relative;
                      .image{
                          width: 0.8rem;
                          height:0.8rem;
                          overflow: hidden;
                          border-radius: 0.15rem;
                          img{
                              width: 100%;
                              height: 100%;
                          }
                      }
                      .dot{
                          width: 12px;
                          height: 12px;
                          border-radius: 50%;
                          position: absolute;
                          top:-3px;
                          right: 18px;
                          background-color: red;
                          text-align: center;
                          line-height: 12px;
                        span{
                            font-size:0.16rem; 
                            color:#fff;
                            display: inline-block;
                            transform: scale(0.8);
                        }
                      }
                  }
                  .right{
                      width: 5.9rem;
                      .tit{
                          font-size: 0.26rem;
                          color: #999;
                          display: flex;
                          justify-content: space-between;
                          span{
                              &:nth-child(1){
                                  font-size: 0.3rem;
                                  color:#333;
                                  font-weight: bold;
                              }
                          }
                      }
                      .neirong{
                          font-size: 0.26rem;
                          color:#666;
                           text-overflow: -o-ellipsis-lastline;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        line-clamp: 2;
                        -webkit-box-orient: vertical;
                      }
                  }
                
              }
          }
      }
    }
</style>
